<template>
  <div>
    <h1>计数器</h1>
    <div>{{store.state.counter.count}}</div>
    <button @click="increment">+mutations</button>
    <button @click="incrementAsync">+actions</button>
  </div>
</template>

<script lang='ts'>
import {ref,reactive} from 'vue'
import {useStore} from 'vuex'
export default{
 setup(){
  const store=useStore()
  const increment=():void=>{
    store.commit('counter/increment',5)    
  }
  const incrementAsync=()=>{
    store.dispatch('counter/incrementAsync',2)
  } 
  return{
    store,
    increment,
    incrementAsync
  }
 }
}
</script>

<style lang='scss' scoped>
</style>